﻿@model Line20.DateTimeRangeField.ViewModels.DateTimeRangeFieldViewModel

@{
    Style.Require("Line20.DateTimeRangeField.BackEnd.Style");
    
    Script.Require("Line20.DateTimeRangeField.DateTimePicker");
    Script.Require("Line20.DateTimeRangeField.Automation");
    Script.Require("Line20.DateTimeRangeField.Hints");
    Script.Require("Line20.DateTimeRangeField.Localize.TimePicker");
    Script.Require("Line20.DateTimeRangeField.Localize.DatePicker");
    
    //Script.Include("localization/jquery-ui-timepicker-" + @Model.Culture + ".js").AtFoot();
    //Script.Include("localization/jquery.ui.datepicker-" + @Model.Culture + ".js").AtFoot();
}

    <fieldset>
        <label>@Model.DisplayName</label>

        @{
            var startHint = "Date time";
            var endHint = "Date time";
            if (Model.Display == Line20.DateTimeRangeField.Settings.DateTimeRangeFieldDisplays.DateOnly) {
                startHint = endHint = "Date";
            }
            if (Model.Display == Line20.DateTimeRangeField.Settings.DateTimeRangeFieldDisplays.TimeOnly) {
                startHint = endHint = "Time";
            }
            if (Model.Display == Line20.DateTimeRangeField.Settings.DateTimeRangeFieldDisplays.SingleDateAndTime) {
                endHint = "Time";
            }

            var startFieldId = Html.FieldIdFor(m => Model.StartDateTime);
            var endFieldId = Html.FieldIdFor(m => Model.EndDateTime);
        }

        @T("Start"): 
        <label class="forpicker" for="@startFieldId">@T(startHint)</label>
        <span class="date">@Html.EditorFor(m => m.StartDateTime)</span>

        @T("End"): 
        <label class="forpicker" for="@endFieldId">@T(endHint)</label>
        <span class="date">@Html.EditorFor(m => m.EndDateTime)</span>

        <text>@Html.ValidationMessageFor(m=>m.StartDateTime)</text>
        <text>@Html.ValidationMessageFor(m=>m.EndDateTime)</text>
        <span class="hint">@Model.Hint</span>
    </fieldset>

@using(Script.Foot()) {
<script type="text/javascript">
//<![CDATA[
    $(function () {
        AutomateDisplay('@Model.Display', '@startFieldId', '@endFieldId', '@Model.Culture', '@T(startHint)', '@T(endHint)')
    })
//]]>
</script>
}